<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <title>fullPage.js — 基本演示_dowebok</title>
    <link rel="stylesheet" href="https://cdn.dowebok.com/77/css/jquery.fullPage.css">
    <style>
        .section {
            text-align: center;
            font: 50px "Microsoft Yahei";
            color: #fff;
        }
    </style>
    <script src="https://cdn.staticfile.org/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://cdn.dowebok.com/77/js/jquery.fullPage.min.js"></script>
    <script>
        $(function () {
            $('#dowebok').fullpage({
                sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', '#f90'],
                navigation: true,
            });
        });
    </script>
</head>

<body>

    <div id="dowebok">
        <div class="section">
            <h3>第一屏</h3>
            <p>fullPage.js — 基本演示</p>
        </div>
        <div class="section">
            <div class="slide">
                <h3>第二屏的第一屏</h3>
            </div>
            <div class="slide">
                <h3>第二屏的第二屏</h3>
            </div>
            <div class="slide">
                <h3>第二屏的第三屏</h3>
            </div>
        </div>
        <div class="section">
            <h3>第三屏</h3>
        </div>
        <div class="section">
            <h3>第四屏</h3>
            <p>这是最后一屏</p>
        </div>
    </div>

    <a href="https://www.dowebok.com/" style="display: none;">dowebok</a>
    <a href="https://www.dowebok.com/77.html" style="display: none;">jQuery全屏滚动插件fullPage.js</a>
    <script>
        var script = document.createElement('script')
        script.src = 'https://s5.cnzz.com/z_stat.php?id=1253231826&web_id=1253231826'
        script.async = true
        document.body.appendChild(script)
    </script>

</body>

</html>